@extends('admin.layout.common')
@section('content')
    <link rel="stylesheet" type="text/css" href="{{URL::asset('/css/user/AccountAgencyCenter.css')}}">
    <style>
        .houlai>input{
            margin: 10px 4px;
        }
    </style>
    <div class="content">
        <div class="mon">
            <div class="mon_left">
                <p>
                    <i class="iconfont icon gongzuo">&#xe647;</i>
                    <span>{{date('Y年m月d日')}}  本月已开户{{ session('monthPass') }}个  打回{{session('monthRefuse')}}个</span>
                <p>超过了{{ session('monthPrecent') }}的三咖审核员，继续努力！从此踏上人生巅峰，迎娶白富美！</p>
                </p>
            </div>
            <div class="mon_right">
                <p>您今天已经开户{{session('todayPass')}}个    打回{{session('todayRefuse')}}个</p>
                <p>超过了{{session('todayPrecent')}}的三咖开户员哦~棒棒哒！！！</p>
            </div>
        </div>
        <p class="tongzhi"><i class="iconfont icon laba">&#xe914;</i>{{getArticleByDepartmentId()}}</p>
        <h1 class="h1" style="font-weight:700;line-height:60px;">代理开户中心</h1>
        <!-- 公共结束 -->
        <form style="margin:20px 0 0 30px;" class="cmxform" id="signupForm" method="post" action="" enctype="multipart/form-data">
            {{csrf_field()}}
            <p>
                <label for="">*代理性质</label>
                <select name="agent_type" style="width: 239px;">
                    <option value="1">录音棚</option>
                    <option value="2">cp公司</option>
                    <option value="3">业内达人</option>
                    <option value="4">老师</option>
                    <option value="5">制作人</option>
                    <option value="6">独立音乐人</option>
                    <option value="7">乐手</option>
                    <option value="8">词曲人</option>
                    <option value="9">媒体人</option>
                    <option value="10">自媒体</option>
                    <option value="11">正规媒体</option>
                    <option value="12">软件渠道</option>
                    <option value="13">网红达人</option>
                    <option value="14">经纪人</option>
                </select>
                <label for="">*代理全称<input type="text" placeholder="代理全称" name="full_name" required></label>
                <label for="">*代理简称<input type="text" placeholder="代理简称" name="simple_name" required></label>
                <label for="">*联系人<input type="text" placeholder="联系人" name="phone_name" required></label>
            </p>
            <p>
                <label for="">*证件类型</label>
                <select name="card_type" style="width: 239px;">
                    <option value="1">身份证（中国）</option>
                    <option value="2">营业执照（中国）</option>
                    <option value="3">护照（限海外）</option>
                    <option value="4">其他证件（限海外）</option>
                </select>
                <label for="">*证件号<input type="text" placeholder="证件号" name="card" required></label>
                <label for="">*移动电话<input type="text" placeholder="移动电话" name="phone" required></label>
                <label for="">固定电话<input type="text" placeholder="固定电话" name="telephone"></label>
            </p>
            <p>
                <label for="">*Email<input type="email" placeholder="Email地址" name="email" required></label>
                <label for="">微信<input type="text" placeholder="微信" name="weixin"></label>
                <label for="">微博<input type="text" placeholder="微博" name="weibo"></label>
                <label for="">网址<input type="url" placeholder="http://" name="url"></label>
            </p>
            <div class="informationBox">
                <div class="detailBox">
                    <label for=""><input name="memory_day1" type="date" class="input_date"></label>
                    <i class="icon iconfont rili">&#xe614;</i>
                    <select name="memory_des1" id="">
                        <option value="生日">生日</option>
                        <option value="开业">开业</option>
                        <option value="主管生日">主管生日</option>
                    </select>
                    <i class="icon iconfont jiahao_1" style="cursor:pointer;">&#xe600;</i>
                </div>
                <div class="detailBoxtwo" style="display:none;">
                    <label for=""><input name="memory_day2" type="date" class="input_date"></label>
                    <i class="icon iconfont rili">&#xe614;</i>
                    <select name="memory_des2" id="">
                        <option value="生日">生日</option>
                        <option value="开业">开业</option>
                        <option value="主管生日">主管生日</option>
                    </select>
                    <i class="icon iconfont jiahao_2" style="cursor:pointer;">&#xe600;</i>
                </div>
                <div class="detailBoxthree"  style="display:none;">
                    <label for=""><input name="memory_day3" type="date" class="input_date"></label>
                    <i class="icon iconfont rili">&#xe614;</i>
                    <select name="memory_des3" id="">
                        <option value="生日">生日</option>
                        <option value="开业">开业</option>
                        <option value="主管生日">主管生日</option>
                    </select>
                </div>
            </div>
            <p class="houlai" style="">
                <label for="">*</label>
                <select name="scale" required>
                    <option value="">选择代理分成比例</option>
                    <option value="0">代理0</option>
                    <option value="1">代理1</option>
                    <option value="2">代理2</option>
                    <option value="3">代理3</option>
                    <option value="4">代理4</option>
                    <option value="5">代理5</option>
                    <option value="6">代理6</option>
                    <option value="7">代理7</option>
                </select>
                <input type="file" class="upload_file" name="protocol_file" onchange="doChange(this)" style="display:none;" />
                <input class="photoCover" type="text" maxlength="0" placeholder="请上传协议备案"  required>
                <input type="button" onclick="$('input[class=upload_file]').click();" class="mybutton" value="协议档案"/>
                <input type="file" class="upload_filetwo" name="record_file" onchange="doChangetwo(this)" style="display:none;" />
                <input class="photoCovertwo" maxlength="0" type="text" placeholder="请上传营业执照" required>
                <input type="button" onclick="$('input[class=upload_filetwo]').click();" class="mybutton" value="营业执照"/>
                <input type="date" name="fix_date" style="width: 180px" required>
                <i class="icon iconfont rili">&#xe614;</i>
                <select name="fix_choose" required>
                    <option value="">约期选择</option>
                    <option value="1">1年</option>
                    <option value="2">2年</option>
                    <option value="3">3年</option>
                    <option value="5">5年</option>
                    <option value="7">7年</option>
                    <option value="10">10年</option>
                </select>
            </p>
            <p>
                <label for="">*主营业员选择</label>
                <select id="zhu" name="main" required>
                    <option value="">主营业员选择</option>
                    <option value="无">无主营业员</option>
                    @foreach($saleList as $v)
                        @if($v['type'] == 1)
                        <option value="{{$v['name']}}">{{$v['name']}}</option>
                        @endif
                    @endforeach
                </select>
                <label for="">辅助营业员选择</label>
                <select id="fu" name="assist">
                    <option value="">辅营业员选择</option>
                    @foreach($saleList as $v)
                        @if($v['type'] == 2)
                        <option value="{{$v['name']}}">{{$v['name']}}</option>
                        @endif
                    @endforeach
                </select>
                <label for="">*协议简述</label>
                <input type="text" placeholder="协议简述" name="protocol" required>
            </p>
            <p>
                <div class="info">
                    <div>
                        <label class="layui-form-label">*地理地址</label>
                        <select id="s_province" name="provice" required></select>  
                        <select id="s_city" name="city" required></select>  
                        <select id="s_county" name="area" required></select>
                        <script class="resources library" src="{{asset('/common/js/area/area.js')}}" type="text/javascript"></script>
                        <script type="text/javascript">_init_area();</script>
                        <input type="text" placeholder="详细地址" name="address" required>
                    </div>
                    <div id="show"></div>
                </div>
            </p>
            <p>
                <label for="">*收款人姓名<input type="text" placeholder="姓名" name="payee_name"  style="width:187px;" required></label>
                <label for="creditcard">*银行卡卡号<input type="text" placeholder="卡号" name="band_card"  required></label>
                <label for="">*开户行信息 <input type="text" placeholder="开户行" name="band_info" required></label>
            </p>
            <textarea name="remark" cols="30" rows="10" placeholder="备注" style="width:100%;height:100px;margin:20px 0;"></textarea>
            <p class="queren"><input type="checkbox" class="checkbox" value="Bike" required/>我已确认所有内容完整</p>
            <p class="kaitong_box"><input type="submit" value="开通账号" class="liulan kaitong"></p>
        </form>
    </div>
    <script>
    $(function(){
        $('#zhu').change(function(){
            var val = $(this).val();
            $('#fu').find('option').each(function(index,item){
              if(val == $(item).val()) {
                $(item).attr('disabled',true)
              }else{
                $(item).attr('disabled',false)
              }
            })
        })
        $('.jiahao_1').click(function(){
            $('.detailBoxtwo').show();
        });
        $('.jiahao_2').click(function(){
            $('.detailBoxthree').show();
        });
        layui.use(['form', 'layedit', 'laydate'], function(){
            var form = layui.form
                ,layer = layui.layer
                ,layedit = layui.layedit
                ,laydate = layui.laydate;
            //日期
            laydate.render({
                elem: '#date'
            });
            laydate.render({
                elem: '#date1'
            });
            //创建一个编辑器
            var editIndex = layedit.build('LAY_demo_editor');
            //自定义验证规则
            form.verify({
                title: function(value){
                    if(value.length < 5){
                        return '标题至少得5个字符啊';
                    }
                }
                ,pass: [/(.+){6,12}$/, '密码必须6到12位']
                ,content: function(value){
                    layedit.sync(editIndex);
                }
            });
            //监听指定开关
            form.on('switch(switchTest)', function(data){
                layer.msg('开关checked：'+ (this.checked ? 'true' : 'false'), {
                    offset: '6px'
                });
                layer.tips('温馨提示：请注意开关状态的文字可以随意定义，而不仅仅是ON|OFF', data.othis)
            });
            //监听提交
            form.on('submit(demo1)', function(data){
                layer.alert(JSON.stringify(data.field), {
                    title: '最终的提交信息'
                })
                return false;
            });
            //表单初始赋值
            form.val('example', {
                "username": "贤心" // "name": "value"
                ,"password": "123456"
                ,"interest": 1
                ,"like[write]": true //复选框选中状态
                ,"close": true //开关状态
                ,"sex": "女"
                ,"desc": "我爱 layui"
            })
        });
        // $("#signupForm").validate({
        //     rules: {
        //         vehicle: "required"
        //     },
        //     messages: {
        //         vehicle: "请接受我们的声明",
        //     }
        // })

    })
    function doChange(file){
        var upload_file = $.trim($(".upload_file").val());    //获取上传文件
        $('.photoCover').val(upload_file);     //赋值给自定义input框
    }
    function doChangetwo(file){
        var upload_filetwo = $.trim($(".upload_filetwo").val());    //获取上传文件
        $('.photoCovertwo').val(upload_filetwo);     //赋值给自定义input框
    }

    //城市三级联动
    var Gid  = document.getElementById ;

    var showArea = function(){

      Gid('show').innerHTML = "<h3>省" + Gid('s_province').value + " - 市" +

          Gid('s_city').value + " - 县/区" +

          Gid('s_county').value + "</h3>"

    }

    Gid('s_county').setAttribute('onchange','showArea()');

</script>
@endsection

